var vm = new Vue({
    el: '#contentContainer',
    data: {
        dateRange: [],
        responseTime: '',
        tableData: [],
        pageNum: 1,
        pageSize: 50,
        pageSizes: [20, 30, 40, 50],
        total: 0
    },
    created: function () {
        this.loadData();
    },
    mounted: function () {
        //动态计算table的高度
        var winHeight = $(window).height();
        var toolbarHeight = $('#toolbar').height() + 2 || 0;
        var paginationHeight = $('#pagination').height() || 0;
        var tableMargin = parseInt($('.dataTable').css('margin-top') || 0)
            + parseInt($('.dataTable').css('margin-bottom') || 0);
        var containerPadding = parseInt($('.contentContainer').css('padding-top') || 0)
            + parseInt($('.contentContainer').css('padding-bottom') || 0);

        var tableHeight = winHeight - toolbarHeight - paginationHeight
            - tableMargin - containerPadding;

        $('#elTable').height(tableHeight);
    },
    methods: {
        loadData: function () {
            var $this = this;

            var beginTime;
            var endTime;
            var minResponseTime;
            var maxResponseTime;

            if ($this.dateRange.length == 2) {
                beginTime = $this.dateRange[0];
                endTime = $this.dateRange[1];
            }

            if ($this.responseTime.length > 0) {
                var responseTimeRange = $this.responseTime.split('-');
                if (responseTimeRange.length == 1) {
                    minResponseTime = responseTimeRange[0];
                }

                if (responseTimeRange.length == 2) {
                    minResponseTime = responseTimeRange[0];
                    maxResponseTime = responseTimeRange[1];
                }
            }

            Common.getJson('/ops/log/getBusinessLogList',
                {
                    pageNum: $this.pageNum, pageSize: $this.pageSize,
                    beginTime: beginTime, endTime: endTime,
                    minResponseTime: minResponseTime, maxResponseTime: maxResponseTime
                },
                function (response) {
                    if (!response || response.status != 200)
                        return;

                    var result = response.result;
                    $this.tableData = result.list;
                    $this.pageNum = result.pageNum;
                    $this.pageSize = result.pageSize;
                    $this.total = result.total;
                });
        },
        onSizeChange: function (size) {
            this.pageNum = 1;
            this.pageSize = size;
            this.loadData();
        },
        onCurrentChange: function (currentPage) {
            if (this.pageNum === currentPage)
                return;

            this.pageNum = currentPage;
            this.loadData();
        },
        onSearch: function () {
            this.pageNum = 1;
            this.loadData();
        }
    }
});